<!DOCTYPE html>
<html>
<head>
    <title>门店详情</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=320; initial-scale=1.0;maximum-scale=1.0; user-scalable=no;"/>
    <meta name="apple-mobile-web-app-status-bar-style" content='black' />
    <meta content="telephone=no" name="format-detection" />
    <meta http-equiv="x-rim-auto-match" content="none">
    <link href="/static/css/jquery.mobile-1.4.3.css" rel="stylesheet" type="text/css"/>
    <link href="/static/css/overwrite.css" rel="stylesheet" type="text/css" />
    <link href="/static/css/style.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="/static/js/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="/static/js/jquery.mobile-1.4.3.js"></script>
    <script type="text/javascript" src="http://api.map.baidu.com/api?type=quick&ak=755d808b3fd553009dfe365870749c4a&v=1.0"></script>
</head>
<body>
    <div id="storeDetails" data-role="page">
        <div data-role="content">
            <div class="ui-grid-b" id="intro">
                <div class="ui-block-a">
                    <img src="{{ s.storeLogo }}">
                </div>
                <div class="ui-block-b">
                    <ul>
                        <li>
                            <h1>{{ s.storeName }}</h1>
                        </li>
                        <li>
                            <div class="contact"><span class="address">{{ s.storeAddress }}</span></div>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="ui-grid-b ui-box-container" id="phoneNumber">
                <div class="ui-btn ui-input-btn ui-corner-all ui-shadow contact">
                    <a href="tel:{{ phoneNumber }}">
                        <img width="16px" src="/static/images/icons-png/phone_2.png"/>
                            <span class="phoneNum">{{ s.storePhone }}</span>
                            <span style="color: #aaa;font-size: 12px">点击拨打电话</span>
                        <span style="float: right"><img src="/static/images/icons-png/carat-r-black.png"/></span>
                    </a>
                </div>
            </div>
            <div class="ui-grid-b ui-box-container" id="ads">
                <div class="ui-btn ui-input-btn ui-corner-all ui-shadow contact">
                    <a href="/appSide/adDetails/" rel='external' data-transition='slide'><img width="100%" src="/static/images/ads1.jpg"/></a>
                </div>
            </div>
            <div class="ui-grid-b ui-box-container">
                <div class="ui-btn ui-input-btn ui-corner-all ui-shadow">
                    <div class="ui-box-title">
                        <h2>店铺地址</h2>
                    </div>
                    <div  id="single_map" style="width: 100%;height: 320px;margin-top: 10px">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script>
        var map = new BMap.Map("single_map");            // 创建Map实例
        // 创建Map实例
        map.centerAndZoom(new BMap.Point({{ s.geo_x }},{{ s.geo_y }}), 20);
        map.addControl(new BMap.ZoomControl());          //添加地图缩放控件
        var marker1 = new BMap.Marker(new BMap.Point({{ s.geo_x }},{{ s.geo_y }}));  // 创建标注
        map.addOverlay(marker1);              // 将标注添加到地图中
        //创建信息窗口
        var infoWindow1 = new BMap.InfoWindow("普通标注");
    </script>
</body>
</html>